<!DOCTYPE html>
<html>
<script src="../../resources/testharness.js"></script>
<script src="../../resources/testharnessreport.js"></script>
<script>
function enableStates(gl)
{
    gl.enable(gl.CULL_FACE);
    gl.enable(gl.BLEND);
    gl.enable(gl.DITHER);
    gl.enable(gl.STENCIL_TEST);
    gl.enable(gl.DEPTH_TEST);
    gl.enable(gl.SCISSOR_TEST);
}

function testStates(gl)
{
    assert_true(gl.isEnabled(gl.CULL_FACE), 'CULL_FACE should be enabled');
    assert_true(gl.isEnabled(gl.BLEND), 'BLEND should be enabled');
    assert_true(gl.isEnabled(gl.DITHER), 'DITHER should be enabled');
    assert_true(gl.isEnabled(gl.STENCIL_TEST), 'STENCIL_TEST should be enabled');
    assert_true(gl.isEnabled(gl.DEPTH_TEST), 'DEPTH_TEST should be enabled');
    assert_true(gl.isEnabled(gl.SCISSOR_TEST), 'SCISSOR_TEST should be enabled');
}

test(function() {
    var canvas = new OffscreenCanvas(100, 100);
    var gl = canvas.getContext('webgl');
    enableStates(gl);

    gl.clearColor(0.0, 1.0, 0.0, 1.0);
    gl.clear(gl.COLOR_BUFFER_BIT);
    testStates(gl);

    var image = canvas.transferToImageBitmap();
    testStates(gl);
}, 'offscreenCanvas.transferToImageBitmap should not alter WebGL states');

test(function() {
    var canvas = document.createElement('canvas');
    canvas.width = canvas.height = 100;
    var offscreenCanvas = canvas.transferControlToOffscreen();
    var gl = offscreenCanvas.getContext('webgl');
    enableStates(gl);

    gl.clearColor(0.0, 1.0, 0.0, 1.0);
    gl.clear(gl.COLOR_BUFFER_BIT);
    testStates(gl);

    testStates(gl);
}, 'offscreenCanvas.commit should not alter WebGL states');
</script>
</html>
